@layout("/common/_container.html"){
<div class="container-fluid" style="padding: 0 !important;">
	<div class="row">
		<div class="col-sm-12">
			<div id = "homePage" class="alert alert-success alert-dismissable">
				<button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
				你好，欢迎登陆房舍通系统！
			</div>
		</div>
	</div>
</div>
<div id = "main">
	<div id="topMain"></div>
	<div id="bottomMain"></div>
</div>
<div id = 'rightMain'>
	<div id = 'right-main' style = "width: 700px; height: 600px; "></div>
</div>
<script type="text/javascript">
    var myChart = echarts.init(document.getElementById('topMain'))
    data = [["2000-06-05",116],["2000-06-06",129],["2000-06-07",135],["2000-06-08",86],["2000-06-09",73],["2000-06-10",85],["2000-06-11",73],["2000-06-12",68],["2000-06-13",92],["2000-06-14",130],["2000-06-15",245],["2000-06-16",139],["2000-06-17",115],["2000-06-18",111],["2000-06-19",309],["2000-06-20",206],["2000-06-21",137],["2000-06-22",128],["2000-06-23",85],["2000-06-24",94],["2000-06-25",71],["2000-06-26",106],["2000-06-27",84],["2000-06-28",93],["2000-06-29",85],["2000-06-30",73],["2000-07-01",83],["2000-07-02",125],["2000-07-03",107],["2000-07-04",82],["2000-07-05",44],["2000-07-06",72],["2000-07-07",106],["2000-07-08",107],["2000-07-09",66],["2000-07-10",91],["2000-07-11",92],["2000-07-12",113],["2000-07-13",107],["2000-07-14",131],["2000-07-15",111],["2000-07-16",64],["2000-07-17",69],["2000-07-18",88],["2000-07-19",77],["2000-07-20",83],["2000-07-21",111],["2000-07-22",57],["2000-07-23",55],["2000-07-24",60]];



    var bottomChart = echarts.init(document.getElementById('bottomMain'))
    option = {
        title: {
            text: '房屋租住月统计量',
//            subtext: '纯属虚构'
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data:['最高气温','最低气温']
        },
        toolbox: {
            show: true,
            feature: {
                dataZoom: {
                    yAxisIndex: 'none'
                },
                dataView: {readOnly: false},
                magicType: {type: ['line', 'bar']},
                restore: {},
                saveAsImage: {}
            }
        },
        xAxis:  {
            type: 'category',
            boundaryGap: false,
            data: ['周一','周二','周三','周四','周五','周六','周日','周三','周四','周五','周六','周日']
        },
        yAxis: {
            type: 'value',
            axisLabel: {
                formatter: '{value} °C'
            }
        },
        series: [
            {
                name:'最高气温',
                type:'line',
                data:[11, 11, 15, 13, 12, 13, 10, 15, 13, 12, 13, 10],
                markPoint: {
                    data: [
                        {type: 'max', name: '最大值'},
                        {type: 'min', name: '最小值'}
                    ]
                },
                markLine: {
                    data: [
                        {type: 'average', name: '平均值'}
                    ]
                }
            },
            {
                name:'最低气温',
                type:'line',
                data:[1, -2, 2, 5, 3, 2, 0, 2, 5, 3, 2, 0],
                markPoint: {
                    data: [
                        {name: '周最低', value: -2, xAxis: 1, yAxis: -1.5}
                    ]
                },
                markLine: {
                    data: [
                        {type: 'average', name: '平均值'},
                        [{
                            symbol: 'none',
                            x: '90%',
                            yAxis: 'max'
                        }, {
                            symbol: 'circle',
                            label: {
                                normal: {
                                    position: 'start',
                                    formatter: '最大值'
                                }
                            },
                            type: 'max',
                            name: '最高点'
                        }]
                    ]
                }
            }
        ]
    };
    var monthArr = [];
    $.ajax({
        method: 'post',
        url: Feng.ctxPath + '/room/selectRoomCountEveryMonth',
        data: {
            'dateType': '0',
            'isRent': '1'
        },
        success: function(data){
            monthArr = [];
            console.log(data.length)
            for(var i = 0; i < data.length; i++){
                monthArr.push(data[i].month);
			}
//			console.log(monthArr)
			option.xAxis.data = monthArr;
            bottomChart.setOption(option, true);
        }
    })


    // 统计房屋总量，未出租，已出租情况
    var rightChart = echarts.init(document.getElementById('right-main'));
    myChart.title = '折柱混合';
	var sum;
	var receive = [];
    // 使用刚指定的配置项和数据显示图表。
    $.ajax({
		method: 'get',
		url: Feng.ctxPath + '/room/getRoomCount',
		async: 'true',
		success: function (data) {
			console.log(data)
            receive = [];
			sum = data;
			receive.length = 12;
			for(var i = 0; i < receive.length; i++){
				receive[i] = sum;
            }
            rightChart.setOption({
                title: {
                    text: '房屋年统计量'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#999'
                        }
                    }
                },
                toolbox: {
                    feature: {
                        dataView: {show: true, readOnly: false},
                        magicType: {show: true, type: ['line', 'bar']},
                        restore: {show: true},
                        saveAsImage: {show: true}
                    }
                },
                legend: {
                    data:['已出租','总房屋数量','未出租']
                },
                xAxis: [
                    {
                        type: 'category',
                        data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '水量',
                        min: 0,
                        max: 20,
                        interval: 4,
                        axisLabel: {
                            formatter: '{value}间'

                        }
                    },
                    {
                        type: 'value',
                        name: '温度',
                        min: 0,
                        max: 25,
                        interval: 5,
                        axisLabel: {
                            formatter: '{value} °C'
                        }
                    }
                ],
                series: [
                    {
                        name:'已出租',
                        type:'bar',
                        data:[1, 9, 0, 8, 12, 16, 15, 13, 4, 12, 8, 0],
                        itemStyle:{
                            normal:{
                                color:'#9c9cb7'
                            }
                        }
                    },
                    {
                        name:'总房屋数量',
                        type:'bar',
                        data: receive,
                        itemStyle:{
                            normal:{
                                color:'#281e3c'
                            }
                        }
                    },
                    {
                        name:'未出租',
                        type:'line',
                        yAxisIndex: 1,
                        data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
                        itemStyle:{
                            normal:{
                                color:'#16265a'
                            }
                        }
                    }
                ]
            }, true)
        },
		error: function () {
			console.log('失败')
        }
	})


    window.onresize = function () {
        rightChart.resize();
        myChart.resize();
    }
</script>
@}
